<template>
  <view class="content">
    <view class="title">
      子组件B
    </view>
    <view class="b-box">
      CompA组件传进来的值:
      <text class="intent-text-box">{{result}}</text>
    </view>
    <view class="b-box" style="margin: 10rpx;">
      <text>回传值: </text>
      <input type="text" v-model="callbackValue" style="color: yellow;" />
      <button @click="sendOutside()" size="mini">回传</button>
    </view>
  </view>
</template>

<script>
	export default {
		name:"compB",
		data() {
			return {
				result: '', // 接收子组件A的值
				callbackValue: '0595-2788888' // 回传值的默认值
			};
		},
		created() {
		  uni.$on('getIntent', (msg) => {
		    console.error("----CompB----getIntent------>" + msg);
		    this.result = msg;
		  });
		},
		methods:{
			sendOutside(){
				console.warn("----CompB----sendOutside------>" + this.callbackValue);
				this.$emit('callBackFun',this.callbackValue);
			}
		}
	}
</script>

<style>
.content {
  background-color: #3cb371;
  padding: 20rpx;
  margin: 20rpx;
}
.title {
  font-size: 32rpx;
  font-weight: bold;
  margin-bottom: 20rpx;
}
.b-box {
  display: flex;
  align-items: center;
}
.intent-text-box {
  background-color: #0000ff;
  color: #fff;
  padding: 2rpx 10rpx;
  border-radius: 4rpx;
}
input{
	background-color: #cccccc;
}
</style>